<template>
  <pageTabelLayout>
    <template #pageHeader>
      <div class="search-form" v-if="headerShow">
        <a-form size="mini" :model="pageData" layout="inline" :label-col-props="{ span: 9 }"
                :wrapper-col-props="{ span: 15 }" v-if="permissionStore.hasPermisson('xqdsh.cx')">
          <a-form-item :style="{ width: '300px' }" label-col-flex="90px" label="需求公司">
            <a-cascader v-model="pageData.dropDownDataq1" :options="pageData.nameListq1" allow-clear ref="casOb5"
                        @change="cascaderChange5($event, pageData.dropDownDataq1)" class="bacClass"
                        :title="pageData.title5"
                        :loading="pageData.loading5" popup-container="html"/>
          </a-form-item>

          <a-form-item :style="{ width: '300px' }" label-col-flex="90px" label="需求申请部门">
            <a-cascader v-model="pageData.dropDownDataq" :options="pageData.nameListq" allow-clear ref="casOb6"
                        :disabled="pageData.dropDownDataq1 == null || pageData.dropDownDataq1 == ''"
                        @change="cascaderChange6"
                        class="bacClass" :title="pageData.title6" :loading="pageData.loading6" popup-container="html"/>
          </a-form-item>
          <a-form-item :style="{ width: '300px' }" label-col-flex="90px" label="需求人">
            <a-input :style="{ width: '250px' }" class="bacClass" @press-enter="huiche" v-model="pageData.PeopleNeed"
                     allow-clear/>
          </a-form-item>

          <a-form-item :style="{ width: '300px' }" label-col-flex="90px" label="需求单号">
            <a-input :style="{ width: '250px' }" class="bacClass" @press-enter="huiche" v-model="pageData.DemandNumber"
                     allow-clear/>
          </a-form-item>

          <!-- <a-form-item :style="{ width: '300px' }" label-col-flex="90px" label="仓库名称">
            <a-input class="bacClass" placeholder="" v-model="pageData.dropDownDataqsz" @press-enter="huiche"
                     allow-clear/>
          </a-form-item> -->

          <a-form-item :style="{ width: '300px' }" label-col-flex="90px" label="申请日期">
            <a-range-picker popup-container="html" :style="{ width: '250px' }" class="bacClass" @select="onSelect"
                            @clear="onClear" allow-clear/>
          </a-form-item>
        </a-form>
      </div>
      <div class="my-divisders">
        <a-divider orientation="center">
          <icon-double-up v-if="headerShow" @click="headerShow = false" :strokeWidth="2" :size="18"/>
          <icon-double-down v-else @click="headerShow = true" :strokeWidth="2" :size="18"/>
        </a-divider>
      </div>
      <div class="my-tool-bar">
        <Toolbar :items="[
          `${permissionStore.hasPermisson('xqdsh.cx') ? '查询' : ''}`,
          `${permissionStore.hasPermisson('xqdsh.sh') ? '审核' : ''}`,
          `${permissionStore.hasPermisson('xqdsh.bh') ? '驳回' : ''}`,
        ]" @select="selectHandler" @audit="auditSh" @rejected="rejecteds">
        </Toolbar>
      </div>
    </template>
    <template #pageTabel>
      <a-spin :loading="pageData.pageLoading" tip="加载中" dot style="height: 100%; width: 100%; z-index: 999">
        <div style="width: 100%; height: 100%">
          <encapsulation-agrid ref="table1Ref" :configaggrid="configTable1"></encapsulation-agrid>
        </div>
      </a-spin>
    </template>
    <a-drawer style="z-index: 999" ok-text="保存" cancel-text="关闭" :drawer-style="{ zIndex: 999 }" :width="400"
              popup-container=".arco-tabs-content" height="100%" placement="bottom" :visible="pageData.showAdd"
              unmountOnClose
              @ok="sideOk" @cancel="pageData.showAdd = false">
      <template #title>
        {{ pageData.sideTitle }}
      </template>
      <div style="min-width: 1500px; overflow: auto" class="scrollbar">
        <div>
          <el-scrollbar>
            <a-form ref="formRef" layout="horizontal" :model="dataForm" :label-col-props="{ span: 10 }"
                    :wrapper-col-props="{ span: 14 }" size="mini">
              <a-row :gutter="16">
                <a-col :span="4">
                  <a-form-item label="需求公司" field="needCompany" :rules="[{ required: true, message: '公司必填' }]"
                               :validate-trigger="['change', 'blur']">
                    <a-cascader v-model="dataForm.needCompany" :options="pageData.firmGroupList" allow-clear ref="casOb"
                                @change="cascaderChange($event, dataForm.needCompany)" class="bacClass"
                                :title="pageData.title"
                                :loading="pageData.loading" popup-container="html"/>
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item label="需求部门" field="needDepartmentId"
                               :rules="[{ required: true, message: '部门必填' }]"
                               :validate-trigger="['change', 'blur']">
                    <a-cascader v-model="dataForm.needDepartmentId" :options="pageData.bmList" allow-clear ref="casOb1"
                                :disabled="dataForm.needCompany == null || dataForm.needCompany == ''"
                                @change="cascaderChange1"
                                class="bacClass" :title="pageData.title1" :loading="pageData.loading1"
                                popup-container="html"/>
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item label="开单日期">
                    <a-date-picker popup-container="html" :style="{ width: '22rem' }"
                                   :time-picker-props="{ defaultValue: '00:00:00' }" format="YYYY-MM-DD"
                                   v-model="dataForm.needCreateDate" disabled class="bacClass"/>
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item label="需求人">
                    <a-input :style="{ width: '22rem' }" disabled v-model="dataForm.needPerson" class="bacClass"/>
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item label="需求单号" field="purchaseNeedCode"
                               :rules="[{ required: true, message: '需求单号必填' }]"
                               :validate-trigger="['change', 'blur']">
                    <a-input :style="{ width: '22rem' }" placeholder="" v-model="dataForm.purchaseNeedCode" disabled
                             class="bacClass"/>
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item label="需求单类型" field="needType"
                               :rules="[{ required: true, message: '需求类型必填' }]"
                               :validate-trigger="['change', 'blur']">
                    <!-- <a-input :style="{ width: '22rem' }" placeholder="请输入需求类型" v-model="dataForm.needType" /> -->
                    <a-select popup-container="html" placeholder="" class="bacClass" v-model="dataForm.needType"
                              :style="{ width: '22rem' }">
                      <a-option>1</a-option>
                      <a-option>4</a-option>
                      <a-option>7</a-option>
                      <a-option>15</a-option>
                      <!-- <a-option style="color: red; font-weight: bolder" value="0">加急</a-option>
                      <a-option style="color: green; font-weight: bolder" value="1">计划</a-option>
                      <a-option style="color: blue; font-weight: bolder" value="2">临时</a-option> -->
                    </a-select>
                  </a-form-item>
                </a-col>
              </a-row>
              <a-row :gutter="16">
                <!-- <a-col :span="4">
                  <a-form-item label="采购公司" field="useCompany" :rules="[{ required: true, message: '公司必填' }]"
                    :validate-trigger="['change', 'blur']">
                    <a-cascader v-model="dataForm.useCompany" :options="pageData.firmGroupList1" allow-clear ref="casOb2"
                      @change="cascaderChange2($event, dataForm.useCompany)" class="bacClass" :title="pageData.title2"
                      :loading="pageData.loading2" popup-container="html" />
                  </a-form-item>
                </a-col>

                <a-col :span="4">
                  <a-form-item label="采购部门" field="useDepartmentId" :rules="[{ required: true, message: '采购部门必填' }]"
                    :validate-trigger="['change', 'blur']">
                    <a-cascader v-model="dataForm.useDepartmentId" :options="pageData.bmList1" allow-clear ref="casOb3"
                      :disabled="dataForm.useCompany == null || dataForm.useCompany == ''" @change="cascaderChange3"
                      class="bacClass" :title="pageData.title3" :loading="pageData.loading3" popup-container="html" />
                  </a-form-item>
                </a-col> -->
                <a-col :span="4">
                  <a-form-item label="需求说明" field="needInstruction">
                    <a-input class="bacClass" :style="{ width: '96rem' }" v-model="dataForm.needInstruction"/>
                  </a-form-item>
                </a-col>
              </a-row>
            </a-form>
          </el-scrollbar>
        </div>
        <a-space>
          <Toolbar :items="['添加物料', '删除']" @tjWl="tjWl" @del="scWl"></Toolbar>
        </a-space>
        <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true"
                         :suppressDragLeaveHidesColumns="true" rowSelection="multiple" @grid-ready="gridReady2"
                         @columnResized="onColumnResized2" @columnMoved="onColumnMoved2"
                         @columnVisible="onColumnVisible2"
                         style="height: 500px" :defaultColDef="defaultColDef" class="ag-theme-alpine"
                         :rowData="isDataLists"
                         :columnDefs="tableColumns1" :localeText="localeText1"></AgGridVuesCopys>
      </div>
    </a-drawer>
    <a-drawer ok-text="保存" cancel-text="关闭" :drawer-style="{ zIndex: 1001, border: '1px solid #ccc' }"
              popup-container=".arco-tabs-content" height="100%" placement="bottom" :visible="pageData1.showAdd"
              unmountOnClose
              @ok="sideOks" @cancel="pageData1.showAdd = false">
      <template #title>
        {{ pageData1.title }}
      </template>
      <div>
        <a-form layout="vertical" :model="isDataList">
          <a-space>
            <a-form-item label="物料名称">
              <a-select popup-container="html" class="bacClass" :style="{ width: '22rem' }" :loading="loading"
                        @search="handleSearchs" v-model="isDataList.materialName" :filter-option="false" allow-search
                        allow-clear
                        @focus="focusSels" @change="handles">
                <a-option v-for="item in pageData.nameList as any" :value="item.materialName">{{
                    item.materialName
                  }}
                </a-option>
              </a-select>
            </a-form-item>
            <a-form-item label="规格">
              <a-input :style="{ width: '22rem' }" v-model="isDataList.specName" disabled/>
            </a-form-item>
            <a-form-item label="数量">
              <a-input class="bacClass" :style="{ width: '22rem' }" v-model="isDataList.needNum"/>
            </a-form-item>
            <a-form-item label="单位">
              <a-input :style="{ width: '22rem' }" v-model="isDataList.unitName" disabled/>
            </a-form-item>
          </a-space>
          <a-space>
            <a-form-item label="备注">
              <a-input class="bacClass" :style="{ width: '22rem' }" v-model="isDataList.remark"/>
            </a-form-item>
          </a-space>
        </a-form>
      </div>
    </a-drawer>
    <a-modal v-model:visible="visible" title="需求单详情" :width="1200" :footer="false" :draggable="true">
      <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true"
                       :suppressDragLeaveHidesColumns="true" rowSelection="multiple" @grid-ready="gridReady4"
                       @columnResized="onColumnResized4" @columnMoved="onColumnMoved4" @columnVisible="onColumnVisible4"
                       style="height: 500px" :defaultColDef="defaultColDef" class="ag-theme-alpine"
                       :rowData="isDataLists"
                       :columnDefs="tableColumnsXqs" :localeText="localeText1"></AgGridVuesCopys>
    </a-modal>

    <a-modal fullscreen v-model:visible="visibleWl" :on-before-ok="handleOk" @cancel="handleCancel"
             :mask-closable="false">
      <template #title> 选择物料信息</template>
      <div style="width: 85%; display: flex; justify-content: space-between">
        <div>
          <span>物料大类:</span>
          <a-select popup-container="html" class="bacClass" v-model="objectOP.bigClassName1"
                    @search="WLfocusSel(1, $event);" @change="bigChange(1);" :filter-option="false" allow-search
                    allow-clear
                    @focus="WLfocusSel(1)" style="width:150px" @press-enter="Query">
            <a-option v-for="item in objectOP.bigName1" :value="item.id">
              {{ item.bigClassName }}
            </a-option>
          </a-select>
        </div>
        <div>
          <span>物料中类:</span>
          <a-select popup-container="html" class="bacClass" :disabled="!objectOP.bigClassName1"
                    v-model="objectOP.bigClassName2" @search="WLfocusSel(2, $event);" @change="bigChange(2);"
                    :filter-option="false" allow-search allow-clear @focus="WLfocusSel(2)" style="width:150px"
                    @press-enter="Query">
            <a-option v-for="item in objectOP.bigName2" :value="item.id">
              {{ item.middleClassName }}
            </a-option>
          </a-select>
        </div>
        <div>
          <span>物料小类:</span>
          <a-select popup-container="html" class="bacClass" :disabled="!objectOP.bigClassName2"
                    v-model="objectOP.bigClassName3" :filter-option="false" allow-search allow-clear
                    @focus="WLfocusSel(3)"
                    style="width:150px" @search="WLfocusSel(3, $event);">
            <a-option v-for="item in objectOP.bigName3" :value="item.id">
              {{ item.subClassName }}
            </a-option>
          </a-select>
        </div>
        <div>
          <span>物料编号:</span>
          <a-select popup-container="html" class="bacClass" :loading="WLloading2" @search="WLhandleSearch2"
                    v-model="materialCode" :filter-option="false" allow-search allow-clear @focus="WLfocusSel2"
                    @change="WLhandleCode" style="width:150px">
            <a-option v-for="item in pageData.codeList" :value="item.materialCode + '——' + item.materialName">
              {{ item["materialCode"] + ' —— ' + item["materialName"] }}
            </a-option>
          </a-select>
        </div>
        <div>
          <span>物料名称:</span>
          <a-select popup-container="html" class="bacClass" :loading="WLloading3" @search="WLhandleSearch3"
                    v-model="materialName" :filter-option="false" allow-search allow-clear @focus="WLfocusSel3"
                    @change="WLhandleName" style="width:150px">
            <a-option v-for="item in pageData.codeList" :value="item.materialCode + '——' + item.materialName">
              {{ item["materialCode"] + ' —— ' + item["materialName"] }}
            </a-option>
          </a-select>
        </div>
        <div>
          <span>规格:</span>
          <a-select popup-container="html" class="bacClass" :loading="WLloading4" @search="WLhandleSearch4"
                    v-model="specName" :filter-option="false" allow-search allow-clear @focus="WLfocusSel4"
                    style="width:150px">
            <a-option v-for="item in pageData.specList">
              {{ item.specName }}
            </a-option>
          </a-select>
        </div>
        <Toolbar :items="['查询']" @select="Query"></Toolbar>
      </div>
      <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true"
                       :suppressDragLeaveHidesColumns="true" rowSelection="multiple" @grid-ready="gridReady3"
                       @columnResized="onColumnResized3" @columnMoved="onColumnMoved3" @columnVisible="onColumnVisible3"
                       style="height: 500px" :defaultColDef="defaultColDef" class="ag-theme-alpine" :rowData="dataList"
                       :columnDefs="tableColumns3" :localeText="localeText1"></AgGridVuesCopys>
      <paginationCopys :page-size-options="pagingList1" :total="listPage.total" show-total show-jumper show-page-size
                       @change="PageSize3" @page-size-change="change3" style="justify-content: center; margin-top: 50px"
                       :page-size="listPage.size" :current="listPage.page"/>
    </a-modal>
  </pageTabelLayout>
</template>

<script lang="ts">
import {post, get} from '@/api/http'
import {useTable, useRowKey, useTableColumn, usePagination, useRowSelection} from '@/hooks/table'
import emitter from '@/hooks/useEventBus'
import {ref, reactive, onMounted, toRefs} from 'vue'
import Toolbar from '@/components/Toolbar.vue'
import {Form, Message, Modal} from '@arco-design/web-vue'
import {FormInstance} from '@arco-design/web-vue/es/form'
import {String} from 'lodash'
import {baseURL} from '@/api/axios.config'
import axios from 'axios'
import filedownload from 'js-file-download'
import usePermission from '@/store/modules/permission'

import {localeText} from '@/api/aggridZw'
import {pagingList} from '@/api/paging'
import {saveOrUpdateGridState as saveOrUpdateGridState01} from '@/hooks/useGridState'
import {saveOrUpdateGridState as saveOrUpdateGridState02} from '@/hooks/useGridState'
import {saveOrUpdateGridState as saveOrUpdateGridState03} from '@/hooks/useGridState'
import {saveOrUpdateGridState as saveOrUpdateGridState04} from '@/hooks/useGridState'
import {slicing} from '@/utils/caseFrimAndSecRig'
import buttionRender from "@/components/aggridCellRenDerer/buttionRender.vue";

interface SettlementType {
  id: any
  uid: any
  needDepartment: any
  purchaseNeedCode: any
  needCreateDate: any
  needPerson: any
  needType: any
  warehouseName: any
  applyCode: any
  needCompanys: any
  useDepartment: any
  needInstruction: any
  auditState: any
  auditPerson: any
  auditDate: any
  purchaseNeedUId: any
  materialName: any
  materialCode: any
  specName: any
  batchName: any
  unitName: any
  needNum: any
  remark: any
  deleteState: any
  obsoleteState: any
  needCompany: any
  useCompanys: any
  useCompany: any
  needDepartmentId: any
  useDepartmentId: any
}

export default {
  name: 'Requirement',
  setup() {
    const pageData = reactive<{
      nameList: []
      nameLists: []
      nameListz: []
      nameListq: []
      nameListq1: []
      nameListqs: []
      specifications: any
      DemandNumber: any
      PeopleNeed: any
      showAdd: boolean
      sideTitle: string
      dropDownData: any
      dropDownDataq: any
      dropDownDataq1: any
      dropDownDataqs: any
      dropDownDataqsz: any
      dropDownDataqszs: any
      pageLoading: boolean
      rHeight: any
      btnList: any[]
      firmList: any[]
      bmList: any[]
      firmListsy: any[]
      bmListsy: any[]
      bmList1: any[]
      title: any
      isShow: boolean
      firmGroupList: []
      loading: boolean
      title1: any
      loading1: boolean
      title2: any
      loading2: boolean
      firmGroupList1: []
      title3: any
      loading3: boolean
      firmGroupList3: []
      title5: any
      title6: any
      loading5: boolean
      loading6: boolean
      dropDownDataq1s: any
      dropDownDataq2: any
      isDetail: boolean
      isEdit: boolean
      bigName: any[]
      samllName: any[]
      codeList: any[]
      wlNameList: any[]
      specList: any[]
      dataList: any[]
      dataList1: any[]
    }>({
      dataList: [],
      dataList1: [],
      specList: [],
      bigName: [],
      samllName: [],
      codeList: [],
      wlNameList: [],
      isDetail: false,
      isEdit: false,
      loading2: false,
      title2: '',
      loading3: false,
      title3: '',
      firmGroupList3: [],
      dropDownDataq2: '',
      loading1: false,
      title1: '',
      firmGroupList: [],
      firmGroupList1: [],
      nameList: [],
      nameLists: [],
      nameListz: [],
      nameListq: [],
      nameListq1: [],
      nameListqs: [],
      specifications: '',
      PeopleNeed: '',
      DemandNumber: '',
      showAdd: false,
      sideTitle: '新增需求单',
      dropDownData: '',
      dropDownDataq: '',
      dropDownDataq1: '',
      dropDownDataqs: '',
      dropDownDataqsz: '',
      dropDownDataqszs: {},
      pageLoading: false,
      rHeight: '',
      btnList: [],
      firmList: [],
      bmList: [],
      firmListsy: [],
      bmListsy: [],
      bmList1: [],
      title: '',
      isShow: true,
      loading: false,
      title5: '',
      title6: '',
      loading5: false,
      loading6: false,
      dropDownDataq1s: '',
    })
    const permissionStore = usePermission()
    if (permissionStore.hasPermisson('xqdsh.xg')) {
      pageData.isEdit = true
    }
    if (permissionStore.hasPermisson('xqdsh.xq')) {
      pageData.isDetail = true
    }
    const table1Ref = ref<any>(null)
    const tableColumns = [
      {
        field: '',
        headerCheckboxSelection: true,
        checkboxSelection: true,
        width: 50,
        showDisabledCheckboxes: false,
        pinned: 'left',
      },
      {
        headerName: '需求公司',
        field: 'needCompanys',
        width: 150,
      },
      {
        headerName: '需求部门',
        field: 'needDepartment',
        width: 150,
      },
      {
        headerName: '需求单号',
        field: 'purchaseNeedCode',
        width: 150,
      },
      {
        headerName: '开单日期',
        field: 'needCreateDate',
        width: 180,
      },
      {
        headerName: '需求人',
        field: 'needPerson',
        width: 150,
      },
      {
        headerName: '需求类型',
        field: 'needType',
        slotName: 'needType',
        width: 150,
        // cellRenderer: {
        //   template: `
        //     <a-space>
        //       <div style="color:red;font-weight: bolder;" v-if="isDatas.needType == '0'">
        //         加急
        //       </div>
        //       <div style="color:green;font-weight: bolder;" v-if="isDatas.needType == '1'">
        //         计划
        //       </div>
        //       <div style="color:blue;font-weight: bolder;" v-if="isDatas.needType == '2'">
        //         临时
        //       </div>
        //     </a-space>`,
        //   setup(props: any) {
        //     const isDatas = ref(props.params.data)
        //     return {
        //       isDatas,
        //     }
        //   }
        // },
        // filterParams: {
        //   valueFormatter: function (params: any) {
        //     return params.value == '0'
        //         ? '加急'
        //         : params.value == '1'
        //             ? '计划'
        //             : params.value == '2'
        //                 ? '临时'
        //                 : ''
        //   }
        // }
      },
      // {
      //   headerName: '仓库名称',
      //   field: 'warehouseName',
      //   width: 150,
      // },
      {
        headerName: '采购公司',
        field: 'useCompanys',
        width: 150,
      },
      {
        headerName: '采购部门',
        field: 'useDepartment',
        width: 150,
      },
      {
        headerName: '需求说明',
        field: 'needInstruction',
        width: 150,
      },
      {
        headerName: '修改人',
        field: 'updateName',
        width: 150,
      },
      {
        headerName: '审核状态',
        field: 'auditState',
        slotName: 'auditState',
        width: 150,
        pinned: 'right',
        cellRenderer: {
          template: `<el-tag type="warning">待审核</el-tag>`,
        }
      },
      {
        headerName: '操作',
        field: 'action',
        slotName: 'action',
        width: 200,
        pinned: 'right',
        cellRenderer: buttionRender,
        cellRendererParams: {
          buttonList: [
            {
              type: 'primary',
              text: '修改',
              typeName: 'el-button',
              show: pageData.isEdit,
              Callback: (data: any) => {
                editHandler(data)
              },
            },
            {
              type: 'primary',
              text: '详情',
              typeName: 'el-button',
              show: pageData.isDetail,
              Callback: (data: any) => {
                cxDetails(data)
              },
            },
          ],
          eltagSize: 0,
        },
      },
    ]
    var startDate = pageData.dropDownDataqszs.startDate
    var endDate = pageData.dropDownDataqszs.endDate
    let data1 = startDate
    let data2 = endDate
    var formatDate1 = new Date(startDate)
    var formatDate2 = new Date(endDate)
    if (formatDate1 > formatDate2) {
      startDate = data2 ? data2 + ' 00:00:00' : ''
      endDate = data1 ? data1 + ' 23:59:59' : ''
    } else {
      startDate = data1 ? data1 + ' 00:00:00' : ''
      endDate = data2 ? data2 + ' 23:59:59' : ''
    }
    let configTable1 = {
      url: 'purchase/purchaseNeed/getPage', //接口路径
      queryData: {
        deleteState: 0,
        auditState: 0,
        needDepartmentId: pageData.dropDownDataq,
        materialName: pageData.dropDownDataqs,
        warehouseName: pageData.dropDownDataqsz,
        startDate: startDate,
        endDate: endDate,
        specName: pageData.specifications,
        needPerson: pageData.PeopleNeed,
        purchaseNeedCode: pageData.DemandNumber,
        needCompany: pageData.dropDownDataq1,
      },
      paginationShow: true, //分页是否显示
      invokeiIterface: true, //是否调用接
      rowMultiSelectWithClick: true, //点击行是否多选
      column: tableColumns,
      fileName: 'Requirement0-1'
    }

    const total = ref(0)
    const page = ref(1)
    const size = ref(10)

    function PageSize(val: any) {
      pagination.page = val
      doRefresh()
    }

    function change1(val: any) {
      pagination.pageSize = val
      doRefresh()
    }

    function doRefresh() {
      getFirmGroup()
      var startDate = pageData.dropDownDataqszs.startDate
      var endDate = pageData.dropDownDataqszs.endDate
      let data1 = startDate
      let data2 = endDate
      var formatDate1 = new Date(startDate)
      var formatDate2 = new Date(endDate)
      if (formatDate1 > formatDate2) {
        startDate = data2 ? data2 + ' 00:00:00' : ''
        endDate = data1 ? data1 + ' 23:59:59' : ''
      } else {
        startDate = data1 ? data1 + ' 00:00:00' : ''
        endDate = data2 ? data2 + ' 23:59:59' : ''
      }
      table1Ref.value.setQuery({
        deleteState: 0,
        auditState: 0,
        needDepartmentId: pageData.dropDownDataq,
        materialName: pageData.dropDownDataqs,
        warehouseName: pageData.dropDownDataqsz,
        startDate: startDate,
        endDate: endDate,
        specName: pageData.specifications,
        needPerson: pageData.PeopleNeed,
        purchaseNeedCode: pageData.DemandNumber,
        needCompany: pageData.dropDownDataq1,
      })
    }

    const {selectedRowKeys, onSelectionChange} = useRowSelection()
    const pagination = usePagination(doRefresh)
    const table = useTable()
    const rowKey = useRowKey('id')
    const tableColumns1 = [
      {
        headerName: '',
        checkboxSelection: true,
        headerCheckboxSelection: true,
        pinned: 'left',
        width: 50
      },
      {
        headerName: '物料大类',
        field: 'bigClassName',
        width: 150,
      },
      {
        headerName: '物料中类',
        field: 'middleClassName',
        width: 150,
      },
      {
        headerName: '物料小类',
        field: 'subClassName',
        width: 150,
      },
      {
        headerName: '物料编号',
        field: 'materialCode',
        width: 150,
      },
      {
        headerName: '物料名称',
        field: 'materialName',
        width: 150,
      },
      {
        headerName: '规格',
        field: 'specName',
        width: 150,
      },
      // {
      //     headerName: "批次",
      //     field: "batchName",
      //     dataIndex: "batchName",
      //     width: 150
      // },
      {
        headerName: '库存数量',
        field: 'stockNum',
        width: 150,
        cellRenderer: {
          template: `<span>{{ val.stockNum == '' ? 0 : val.stockNum }}<span/>`,
          setup(props: any) {
            const val = ref(props.params.data)
            return {
              val,
              EnterPress
            }
          },
        },
      },
      {
        headerName: '数量',
        field: 'needNum',
        width: 150,
        // slotName: 'needNum',
        cellRenderer: {
          template: `
            <a-input-number name="input" @keyup.enter="EnterPress" v-model="val.needNum" class="input-demo bacClass"
                            :min="0" :max="100000" :precision="2"/>`,
          setup(props: any) {
            const val = ref(props.params.data)
            return {
              val,
              EnterPress
            }
          },
        },
      },
      {
        headerName: '单位',
        field: 'unitName',
        width: 150,
      },
      {
        headerName: '品牌',
        field: 'brandName',
        width: 150,
      },
      {
        headerName: '所属区域',
        field: 'district',
        width: 150,
        // slotName: 'district',
        cellRenderer: {
          template: `
            <a-select popup-container="html" class="bacClass" @focus="focusSel2" v-model="val.district" allow-clear
                      allow-search :disabled="val.fixAssetStatus == 0">
              <a-option v-for="item in districtList">{{ item.areaName }}</a-option>
            </a-select>`,
          setup(props: any) {
            const val = ref(props.params.data)
            return {
              val,
              focusSel2,
              districtList
            }
          },
        },
      },
      {
        headerName: '位置号',
        field: 'locationMark',
        width: 150,
        // slotName: 'locationMark',
        cellRenderer: {
          template: `
            <a-select popup-container="html" class="bacClass" @focus="focusSel1" v-model="val.locationMark" allow-clear
                      allow-search :disabled="val.fixAssetStatus == 0">
              <a-option v-for="item in locationList">{{ item.locationMark }}</a-option>
            </a-select>`,
          setup(props: any) {
            const val = ref(props.params.data)
            return {
              val,
              locationList,
              focusSel1
            }
          },
        },
      },
      {
        headerName: '是否固资',
        field: 'fixAssetStatus',
        width: 150,
        // slotName: 'fixAssetStatus',
        cellRenderer: {
          template: `<span>{{ val.fixAssetStatus == 0 ? '否' : '是' }}</span>`,
          setup(props: any) {
            const val = ref(props.params.data)
            return {
              val,
            }
          },
        },
      },
      {
        headerName: '备注',
        field: 'remark',
        width: 150,
        cellRenderer: {
          template: `
            <a-input class="bacClass" v-model="val.remark"/>`,
          setup(props: any) {
            const val = ref(props.params.data)
            return {
              val,
            }
          },
        },
      },
    ]

    const tableColumnsXqs = [
      {
        headerName: '物料大类',
        field: 'bigClassName',
        dataIndex: 'bigClassName',
        width: 150,
      },
      {
        headerName: '物料中类',
        field: 'middleClassName',
        width: 150,
      },
      {
        headerName: '物料小类',
        field: 'subClassName',
        width: 150,
      },
      {
        headerName: '物料编号',
        field: 'materialCode',
        width: 150,
      },
      {
        headerName: '物料名称',
        field: 'materialName',
        width: 150,
      },
      {
        headerName: '规格',
        field: 'specName',
        width: 150,
      },
      {
        headerName: '库存数量',
        field: 'stockNum',
        width: 150,
      },
      {
        headerName: '数量',
        field: 'needNum',
        width: 150,
      },
      {
        headerName: '单位',
        field: 'unitName',
        width: 150,
      },
      {
        headerName: '品牌',
        field: 'brandName',
        width: 150,
      },
      {
        headerName: '所属区域',
        field: 'district',
        width: 150,
      },
      {
        headerName: '位置号',
        field: 'locationMark',
        width: 150,
      },
      {
        headerName: '是否固资',
        field: 'fixAssetStatus',
        width: 150,
        cellRenderer: {
          template: `<span>{{ val.fixAssetStatus == 0 ? '否' : '是' }}</span>`,
          setup(props: any) {
            const val = ref(props.params.data)
            return {
              val,
            }
          },
        },
      },
      {
        headerName: '备注',
        field: 'remark',
        width: 150,
      },
    ]
    const pageData1 = reactive({
      showAdd: false,
      title: '添加物料',
    })
    const objectOP = reactive<any>({
      bigClassName1: '',
      bigClassName2: '',
      bigClassName3: '',
      bigName1: [],
      bigName2: [],
      bigName3: []
    })
    //下拉框得到焦点
    const focusSel = () => {
      selCxAll({materialCode: '', auditState: 1})
    }
    //下拉数据
    const options = ref<any>(pageData.nameList)
    const loading = ref(false)
    const handleSearch = (value: any) => {
      if (value) {
        const ob = {materialCode: value, auditState: 1}
        loading.value = true
        window.setTimeout(() => {
          selCxAll(ob)
          options.value = pageData.nameList
          loading.value = false
        }, 200)
      } else {
        options.value = []
      }
    }

    //下拉框查询
    function selCxAll(val: any) {
      post({
        url: 'purchase/MaterialInfo/getFieldValue',
        data: val,
      }).then(({data, code}: any) => {
        if (code === 200) {
          // (data as string[]).splice(0, 0, "全部");
          pageData.nameList = data
        } else {
          Message.error({
            content: '查询失败！',
            duration: 5000,
          })
        }
      })
    }

    onMounted(() => {
      emitter.on('Requirement', () => {
        doRefresh()
      })
      pageData.rHeight = document.getElementById('main-container')?.clientHeight
      //表格的高
      if (pageData.rHeight !== undefined) {
        pageData.rHeight = pageData.rHeight
      }
      window.addEventListener('resize', () => {
        pageData.rHeight = document.getElementById('main-container')?.clientHeight

        //表格的高
        if (pageData.rHeight !== undefined) {
          pageData.rHeight = pageData.rHeight
        }
      })
      // foucusUseFrim(1)
      // foucusUseFrim(3)
    })
    //查询
    const selectHandler = () => {
      pagination.page = 1
      doRefresh()
    }
    const queryData = reactive({
      clothType: '',
    })
    const addHandler = () => {
      //清空数据
      getFirmGroup()
      for (const key in dataForm) {
        if (key == 'id') {
          dataForm.id = null
        } else {
          dataForm[key] = ''
        }
      }
      isDataLists.value = []
      pageData.showAdd = true
      pageData.sideTitle = '新增需求单'
    }

    const dataForm = reactive<SettlementType>({
      id: null,
      uid: 0,
      needDepartment: '',
      purchaseNeedCode: '',
      needCreateDate: '',
      needPerson: '',
      needType: '',
      warehouseName: '',
      applyCode: '',
      useDepartment: '',
      needInstruction: '',
      auditState: '',
      auditPerson: '',
      auditDate: '',
      purchaseNeedUId: '',
      materialName: '',
      materialCode: '',
      specName: '',
      batchName: '',
      unitName: '',
      needNum: '',
      remark: '',
      deleteState: '',
      obsoleteState: '',
      needCompanys: null,
      needCompany: null,
      useCompany: null,
      useCompanys: null,
      needDepartmentId: '',
      useDepartmentId: '',
    })

    // 表格准备事件
    const gridOption = ref()
    const colState = ref()
    const gridReady = (params: any) => {
      gridOption.value = params.api
      colState.value = params.columnApi
    }
    const gridOption2 = ref()
    const colState2 = ref()
    const gridReady2 = (params: any) => {
      gridOption2.value = params.api
      colState2.value = params.columnApi
    }
    const gridOption3 = ref()
    const colState3 = ref()
    const gridReady3 = (params: any) => {
      gridOption3.value = params.api
      colState3.value = params.columnApi
    }
    const gridOption4 = ref()
    const colState4 = ref()
    const gridReady4 = (params: any) => {
      gridOption4.value = params.api
      colState4.value = params.columnApi
    }
    const formRef = ref<FormInstance>()
    const sideOk = () => {
      formRef.value?.validate().then((err) => {
        if (!err) {
          let isKong = false
          isDataLists.value.forEach(function (o: any) {
            if (o['materialName'] == '' || o['needNum'] == 0) {
              isKong = true
            }
          })
          if (isKong) {
            Message.warning({
              content: '请将物料名称和数量填写完整',
              duration: 5000,
            })
            return
          }
          let condition = isDataLists.value.some(
              (item: { materialCode: string }, index: number) => {
                if (index !== 0) {
                  return item.materialCode === isDataLists.value[0].materialCode
                }
              }
          )
          if (condition) {
            Message.warning({
              content: '不能添加同样的物料',
              duration: 5000,
            })
            return
          }
          let list = []
          for (let i = 0; i < isDataLists.value.length; i++) {
            var ob = {}
            ob['materialCode'] = isDataLists.value[i].materialCode
            ob['materialName'] = isDataLists.value[i].materialName
            ob['specName'] = isDataLists.value[i].specName
            ob['needNum'] = isDataLists.value[i].needNum
            ob['unitName'] = isDataLists.value[i].unitName
            ob['remark'] = isDataLists.value[i].remark
            ob['useCompany'] = dataForm.useCompany
            ob['fixAssetStatus'] = isDataLists.value[i].fixAssetStatus
            ob['district'] = isDataLists.value[i].district
            ob['locationMark'] = isDataLists.value[i].locationMark
            ob['brandName'] = isDataLists.value[i].brandName
            list.push(ob)
          }
          let stadey: boolean = true
          stadey = list.every((item: any) => {
            if (item.fixAssetStatus == 1) {
              return item.locationMark && item.district
            }
            return true
          })
          if (stadey) {
            if (pageData.sideTitle === '新增需求单') {
              dataForm.id = null
              dataForm.uid = null
              post({
                url: 'purchase/purchaseNeed/insert',
                data: {
                  ...dataForm,
                  purchaseNeedDetail: list,
                },
              }).then((res: any) => {
                if (res.code === 200) {
                  formRef.value?.resetFields()
                  pageData.showAdd = false
                  doRefresh()
                  Message.success({
                    content: '新增成功',
                    duration: 5000,
                  })
                } else {
                  Message.error({
                    content: res.message,
                    duration: 5000,
                  })
                }
              })
            } else {
              post({
                url: 'purchase/purchaseNeed/update',
                data: {
                  ...dataForm,
                  purchaseNeedDetail: list,
                },
              }).then((res: any) => {
                if (res.code === 200) {
                  formRef.value?.resetFields()
                  pageData.showAdd = false
                  doRefresh()
                  //清空数据
                  for (const key in dataForm) {
                    if (key.indexOf('id') != -1) {
                      dataForm.id = null
                    } else {
                      dataForm[key] = ''
                    }
                  }
                  Message.success({
                    content: '修改成功',
                    duration: 5000,
                  })
                } else {
                  Message.error({
                    content: res.message,
                    duration: 5000,
                  })
                }
              })
            }
          } else {
            Message.error('属于固定资产的物料，必须填写所属区域和位置号！')
          }

        }
      })
    }
    const deleteHandler = () => {
      // if (selectedRowKeys.value.length === 0) {
      //     return
      // }
      if (gridOption.value.getSelectedRows().length === 0) {
        return
      }
      Modal.confirm({
        title: '系统提示',
        content: '确认删除选中的数据?',
        onOk() {
          post({
            url: 'purchase/purchaseNeed/delete',
            // data: selectedRowKeys.value
            data: gridOption.value.getSelectedRows().map((o: any) => {
              return o.id
            }),
          }).then(({code, data, message}: any) => {
            if (code === 200) {
              Message.success({
                content: '删除成功',
                duration: 5000,
              })
            } else {
              Message.error({
                content: message,
                duration: 5000,
              })
            }
            doRefresh()
          })
        },
      })
    }
    let isTypeIds = 0
    const editHandler = (record: SettlementType) => {
      getFirmGroup()
      updateGridState02()
      post({
        url: 'purchase/purchaseNeedDetail/getList',
        data: {
          purchaseNeedUId: Number(record.uid),
        },
      }).then((res: any) => {
        if (res.code === 200) {
          getBmGroup(dataForm.needCompany)
          getBmGroup1(dataForm.useCompany)
          isDataLists.value = res.data
          ckNum()
          isDataLists.value.forEach((item: any) => {
            item['isTypeIds'] = isTypeIds++
          })
        }
      })

      // dataForm.id = Number(record.id);
      // // dataForm.purchaseNeedUId = Number(record.purchaseNeedUId)
      // dataForm.uid = Number(record.uid),
      //     dataForm.needCompany = record.needCompany;
      // dataForm.needDepartment = record.needDepartment;
      // dataForm.needCreateDate = record.needCreateDate;
      // dataForm.needPerson = record.needPerson;
      // dataForm.purchaseNeedCode = record.purchaseNeedCode;
      // dataForm.needType = record.needType;
      // dataForm.warehouseName = record.warehouseName;
      // dataForm.useCompany = record.useCompany;
      // dataForm.useDepartment = record.useDepartment;
      // dataForm.needInstruction = record.needInstruction;
      // dataForm.auditPerson = record.auditPerson;
      // dataForm.needCompanys = record.needCompanys
      // dataForm.useCompanys = record.useCompanys
      for (let item in record) {
        dataForm[item] = record[item]
      }
      pageData.sideTitle = '修改需求单'
      pageData.showAdd = true
    }
    //判断是否填写了中文
    const isChiese = (value: string, cb: Function) => {
      return new Promise<void>((resolve) => {
        if (window.encodeURI(value).indexOf('%') !== -1) {
          cb('填写的值不能包含中文！')
        }
        resolve()
      })
    }
    //input离开焦点 将小写转大写
    const inputBlur = () => {
      // dataForm.settlementCode = dataForm.settlementCode.toUpperCase();
    }
    //导出
    const exports = () => {
      // if (selectedRowKeys.value.length === 0) {
      //     Message.error('请先勾选')
      //     return
      // }
      if (gridOption.value.getSelectedRows().length === 0) {
        Message.error('请先勾选')
        return
      } else {
        //将表头拼接出来
        let head =
            '<th>类型编号</th><th>类型名称</th><th>备注</th><th>创建人</th><th>创建时间</th><th>最后修改人</th><th>最后修改时间</th>'
        //拿到当前表格数据与勾选的行做筛选

        let nowRow = table.dataList.filter(function (o) {
          return selectedRowKeys.value.indexOf(o['id']) !== -1
        })
        let body = ''
        nowRow.forEach(function (o) {
          body += '<tr><td>' + o['productTypeCode'] + '</td>'
          body += '<td>' + o['productTypeName'] + '</td>'
          body += '<td>' + o['remark'] + '</td>'
          body += '<td>' + o['createName'] + '</td>'
          body += '<td>' + o['createTime'] + '</td>'
          body += '<td>' + o['updateName'] + '</td>'
          body += '<td>' + o['updateTime'] + '</td>'
          body += '</tr>'
        })
        tableToXlsx(head, '产品类型', body)
      }
    }

    function tableToXlsx(head: any, filename: any, body: any) {
      const uri = 'data:application/vnd.ms-excel;base64,',
          template = `<html>
            <head><meta charset="UTF-8"></head>
            <body><table border="1"><tr>${head}</tr>${body}</table></body>
        </html>`

      const a = document.createElement('a')
      a.href = uri + window.btoa(unescape(encodeURIComponent(template)))
      a.download = filename
      a.click()
      document.removeChild(a)
    }

    //模板下载
    const downloadHandler = () => {
      axios
          .get(baseURL + '/purchase/purchaseNeed/uploadPlanNeedModel', {
            responseType: 'blob',
            headers: {
              token: sessionStorage.getItem('USER-TOKEN-KEY'),
            },
          })
          .then((res) => {
            if (res.status === 200) {
              filedownload(res.data, '需求单.xlsx')
            }
          })
      // get({
      //     url:'purchase/purchaseNeedDetail/uploadPlanNeedModel'
      // }).then((res:any)=>{
      //     console.log(res)
      // })
    }
    //导入
    const importHandler = () => {
      const inputEle: HTMLInputElement = document.createElement('input')
      inputEle.type = 'file'
      inputEle.id = 'fileUploadExcel'
      inputEle.accept =
          'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel'
      inputEle.addEventListener('change', (e) => {
        const formData = new FormData()
        if (inputEle.files !== null) {
          formData.append('file', inputEle.files[0] || '')
        } else {
          Message.warning('未选择文件！')
          return
        }
        pageData.pageLoading = true
        axios
            .post(baseURL + '/purchase/purchaseNeed/analysePlanNeedModel', formData, {
              headers: {
                'Content-Type': 'multipart/form-data',
                token: sessionStorage.getItem('USER-TOKEN-KEY'),
              },
            })
            .then((result) => {
              if (result.data['code'] === 200) {
                Message.success('导入成功')
              } else {
                Message.error(result.data.message)
              }
            })
            .finally(() => {
              pageData.pageLoading = false
              doRefresh()
            })
      })
      inputEle.click()
    }
    const tjWl = () => {
      // isDataLists.value.unshift({
      //   materialCode: '',
      //   materialName: '',
      //   specName: '',
      //   batchName: '',
      //   unitName: '',
      //   needNum: 0,
      //   remark: '',
      //   isTypeIds: isTypeIds++,
      // })
      visibleWl.value = true
    }
    const isDataList = reactive({
      materialCode: '',
      materialName: '',
      specName: '',
      batchName: '',
      unitName: '',
      needNum: '',
      remark: '',
    })

    //下拉框得到焦点
    const focusSels = () => {
      selCxAll({materialName: '', auditState: 1})
    }
    //下拉数据
    const optionss = ref<any>(pageData.nameLists)
    const loadings = ref(false)
    const handleSearchs = (value: any) => {
      if (value) {
        const ob = {materialName: value, auditState: 1}
        loadings.value = true
        window.setTimeout(() => {
          selCxAlls(ob)
          optionss.value = pageData.nameLists
          loadings.value = false
        }, 200)
      } else {
        optionss.value = []
      }
    }

    //下拉框查询
    function selCxAlls(val: any) {
      post({
        url: 'purchase/MaterialInfo/getFieldValue',
        data: val,
      }).then(({data, code}: any) => {
        if (code === 200) {
          // (data as string[]).splice(0, 0, "全部");
          pageData.nameLists = data
        } else {
          Message.error({
            content: '查询失败！',
            duration: 5000,
          })
        }
      })
    }

    // let isDataLists:any = ref([])
    let isDataLists: any = ref([])
    const sideOks = () => {
      if (isDataList.materialName == '') {
        Message.error('物料名称不能为空')
        return
      }
      // let objData = {}
      // objData = Object.assign(isDataList)
      // let objDatas = JSON.parse(JSON.stringify(objData))
      if (isDataLists.value.length === 0) {
        isDataLists.value.push(JSON.parse(JSON.stringify(isDataList)))
        pageData1.showAdd = false
      } else {
        let isAdd = true
        isDataLists.value.forEach((item: any) => {
          //   if(item.materialCode == isDataList.materialCode){
          //     Message.error('物料编号不能重复')
          //   }else
          if (item.materialName == isDataList.materialName) {
            Message.error('物料名称不能重复')
            isAdd = false
          }
        })
        if (isAdd) {
          isDataLists.value.push(JSON.parse(JSON.stringify(isDataList)))
          pageData1.showAdd = false
        }
      }
    }

    let mhNum = 0
    //下拉框得到焦点
    const focusSelz = (num: any) => {
      if (num == 0) {
        selCxAllz({warehouseName: '', auditState: 0})
      } else {
        selCxAllz({warehouseName: ''})
      }

      mhNum = num
    }
    //下拉数据
    const optionsz = ref<any>(pageData.nameListz)
    const loadingz = ref(false)
    const handleSearchz = (value: any) => {
      if (value) {
        const ob = {warehouseName: value}
        if (mhNum == 0) {
          ob['auditState'] = 0
        }

        loadingz.value = true
        window.setTimeout(() => {
          selCxAllz(ob)
          optionsz.value = pageData.nameListz
          loadingz.value = false
        }, 200)
      } else {
        optionsz.value = []
      }
    }

    //下拉框查询
    function selCxAllz(val: any) {
      if (mhNum == 0 && pageData.sideTitle != '修改需求单') {
        post({
          url: 'purchase/purchaseNeed/getDropValue',
          data: val,
        }).then(({data, code}: any) => {
          if (code === 200) {
            // (data as string[]).splice(0, 0, "全部");
            pageData.nameListz = data
          } else {
            Message.error({
              content: '查询失败！',
              duration: 5000,
            })
          }
        })
      } else {
        post({
          url: 'wms/warehouse/getFieldValue',
          data: val,
        }).then(({data, code}: any) => {
          if (code === 200) {
            // (data as string[]).splice(0, 0, "全部");
            pageData.nameListz = data
          } else {
            Message.error({
              content: '查询失败！',
              duration: 5000,
            })
          }
        })
      }
    }

    let selectedRowKeys1 = ref()
    const cancelsDel = () => {
      if (pageData1.showAdd) {
        return
      } else {
        pageData.showAdd = false
      }
    }

    const scWl = () => {
      if (selectedRowKeys1.value == 0) {
        Message.error('请选择要删除的数据')
        return
      }
      if (gridOption2.value.getSelectedRows().length == 0) {
        Message.error('请选择要删除的数据')
        return
      }
      let deleteId = isDataLists.value.map((item: any) => item.isTypeIds);
      let deleteIds = gridOption2.value.getSelectedRows().map((item: any) => item.isTypeIds);
      let list = deleteId.filter((ids: any) => deleteIds.includes(ids));
      isDataLists.value = isDataLists.value.filter((item: any) => !list.includes(item.isTypeIds));
      // if (selectedRowKeys1.value.length > 1) {
      //   // isDataLists.value.forEach((item:any,index:any)=>{
      //   //     selectedRowKeys1.value.forEach((items:any,indexs:any)=>{
      //   //         if(item.materialName == items){
      //   //             isDataLists.value.splice(index,1)
      //   //             selectedRowKeys1.value.splice(indexs,1)
      //   //         }
      //   //     })
      //   // })
      //   selectedRowKeys1.value.forEach((item: any, index: any) => {
      //     isDataLists.value.forEach((items: any, indexs: any) => {
      //       if (item == items.isTypeIds) {
      //         // selectedRowKeys1.value.splice(index,1)
      //         isDataLists.value.splice(indexs, 1)
      //       }
      //     })
      //   })
      //   if (selectedRowKeys1.value.length > isDataLists.value.length) {
      //     selectedRowKeys1.value = []
      //   }
      // } else {
      //   isDataLists.value.some((item: any, index: any) => {
      //     if (selectedRowKeys1.value == item.isTypeIds) {
      //       isDataLists.value.splice(index, 1)
      //       selectedRowKeys1.value = []
      //     }
      //   })
      // }
    }
    //下拉框得到焦点
    const focusSelq = () => {
      selCxAllq({needDepartment: '', auditState: 0})
    }
    //下拉数据
    const optionsq = ref<any>(pageData.nameListq)
    const loadingq = ref(false)
    const handleSearchq = (value: any) => {
      if (value) {
        const ob = {needDepartment: value, auditState: 0}
        loadingq.value = true
        window.setTimeout(() => {
          selCxAllq(ob)
          optionsq.value = pageData.nameListq
          loadingq.value = false
        }, 200)
      } else {
        optionsq.value = []
      }
    }

    //下拉框查询
    function selCxAllq(val: any) {
      post({
        url: 'purchase/purchaseNeed/getDropValue',
        data: val,
      }).then(({data, code}: any) => {
        if (code === 200) {
          // (data as string[]).splice(0, 0, "全部");
          pageData.nameListq = data
        } else {
          Message.error({
            content: '查询失败！',
            duration: 5000,
          })
        }
      })
    }

    //下拉框得到焦点
    const focusSelqs = () => {
      selCxAllqs({materialName: '', auditState: 1})
    }
    //下拉数据
    const optionsqs = ref<any>(pageData.nameListqs)
    const loadingqs = ref(false)
    const handleSearchqs = (value: any) => {
      if (value) {
        const ob = {materialName: value, auditState: 1}
        loadingqs.value = true
        window.setTimeout(() => {
          selCxAllq(ob)
          optionsqs.value = pageData.nameListqs
          loadingqs.value = false
        }, 200)
      } else {
        options.value = []
      }
    }

    //下拉框查询
    function selCxAllqs(val: any) {
      post({
        url: 'purchase/MaterialInfo/getFieldValue',
        data: val,
      }).then(({data, code}: any) => {
        if (code === 200) {
          // (data as string[]).splice(0, 0, "全部");
          pageData.nameListqs = data
        } else {
          Message.error({
            content: '查询失败！',
            duration: 5000,
          })
        }
      })
    }

    // const auditSh = () => {

    // }
    const auditStates = (val: any) => {
      Modal.confirm({
        title: '系统提示',
        content: '是否反审此订单',
        onOk() {
          post({
            url: 'purchase/purchaseNeed/audit',
            data: [
              {
                id: Number(val.id),
                auditState: 0,
              },
            ],
          }).then((res: any) => {
            if (res.code === 200) {
              doRefresh()
              emitter.emit('shauxings')
              Message.success('反审成功')
            } else {
              Message.error(res.message)
            }
          })
        },
      })
    }
    emitter.on('shuaxiong', () => {
      doRefresh()
    })

    const headerShow = ref<boolean>(true)

    const scrollbar = ref(true)
    const scroll = {
      x: 2000,
      y: 200,
    }
    const handles = (record: any) => {
      record.specName = ''
      record.unitName = ''
      record.materialCode = ''
      post({
        url: 'purchase/MaterialInfo/getList',
        data: {
          materialName: record.materialName,
        },
      }).then((res: any) => {
        if (res.code == 200) {
          record.specName = res.data[0].specName
          record.unitName = res.data[0].unit
          record.materialCode = res.data[0].materialCode
        }
      })
    }
    const auditSh = () => {
      if (table1Ref.value.getSelectedRows().length === 0) {
        Message.error('请勾选需要审核的数据')
        return
      }
      // let auditStateId: any = []
      // selectedRowKeys.value.forEach((item: any) => {
      //     auditStateId.push({
      //         id: item,
      //         auditState: 1
      //     })
      // })
      table1Ref.value.getSelectedRows().forEach(function (o: any) {
        o['auditState'] = 1
      })
      Modal.confirm({
        title: '系统提示',
        content: '是否审核此订单',
        onOk() {
          post({
            url: 'purchase/purchaseNeed/audit',
            // data: auditStateId,
            data: table1Ref.value.getSelectedRows(),
          }).then((res: any) => {
            if (res.code === 200) {
              doRefresh()
              emitter.emit('shuaxiong')
              Message.success('审核通过')
              selectedRowKeys.value = []
            } else {
              Message.error(res.message)
            }
          })
        },
      })
    }
    const rejecteds = () => {
      // if (selectedRowKeys.value.length === 0) {
      //     Message.error('请勾选需要审核的数据')
      //     return
      // }
      if (table1Ref.value.getSelectedRows().length === 0) {
        Message.error('请勾选需要审核的数据')
        return
      }

      table1Ref.value.getSelectedRows().forEach(function (o: any) {
        o['auditState'] = 2
      })
      Modal.confirm({
        title: '系统提示',
        content: '是否驳回订单',
        onOk() {
          post({
            url: 'purchase/purchaseNeed/audit',
            // data: auditStateId,
            data: table1Ref.value.getSelectedRows(),
          }).then((res: any) => {
            if (res.code === 200) {
              doRefresh()
              emitter.emit('shuaxiong')
              Message.success('订单已驳回')
              selectedRowKeys.value = []
            } else {
              Message.error(res.message)
            }
          })
        },
      })
    }
    const visible = ref(false)
    //查看详情按钮
    const cxDetails = (record: any) => {
      visible.value = true
      updateGridState04()
      post({
        url: 'purchase/purchaseNeedDetail/getList',
        data: {
          purchaseNeedUId: Number(record.uid),
        },
      }).then((res: any) => {
        if (res.code === 200) {
          isDataLists.value = res.data
          ckNum1(record)
        }
      })
    }

    const compareDate = (dateTime1: any, dateTime2: any) => {
      var formatDate1 = new Date(dateTime1)
      var formatDate2 = new Date(dateTime2)
      if (formatDate1 > formatDate2) {
        return true
      } else {
        return false
      }
    }
    //下拉框得到焦点
    const focusSelq1 = () => {
      selCxAllq1({needCompanys: '', auditState: 0})
    }
    //下拉数据
    const optionsq1 = ref<any>(pageData.nameListq1)
    const loadingq1 = ref(false)
    const handleSearchq1 = (value: any) => {
      if (value) {
        const ob = {
          needCompanys: value,
          auditState: 0,
        }
        loadingq1.value = true
        window.setTimeout(() => {
          selCxAllq1(ob)
          optionsq1.value = pageData.nameListq1
          loadingq1.value = false
        }, 200)
      } else {
        optionsq1.value = []
      }
    }

    //下拉框查询
    function selCxAllq1(val: any) {
      post({
        url: 'purchase/purchaseNeed/getDropValue',
        data: val,
      }).then(({data, code}: any) => {
        if (code === 200) {
          // (data as string[]).splice(0, 0, "全部");
          pageData.nameListq1 = data
        } else {
          Message.error({
            content: '查询失败！',
            duration: 5000,
          })
        }
      })
    }

    //查询公司部门
    // function getGsBm() {
    //   get({
    //     url: 'hr/department/getAllActiveDepartment',
    //   }).then((res: any) => {
    //     if (res.code === 200) {
    //       pageData.firmList = JSON.parse(res.data)
    //     } else {
    //       Message.error({
    //         content: res.message,
    //         duration: 5000,
    //       })
    //     }
    //   })
    // }
    //拿到所有公司
    // const foucusUseFrim = (num: any) => {
    //   let ob = {}
    //   if (num == 1) {
    //     ob['firmName'] = ''
    //     ob['department'] = ''
    //     // ob['firmTypeId'] = ""
    //   }
    //   if (num == 2) {
    //     if (dataForm.needCompany !== '' && dataForm.needCompany !== undefined) {
    //       let list = pageData.firmList.filter(function (o: any) {
    //         return o['id'] == dataForm.needCompany
    //       })
    //       ob['firmName'] = list[0]['firmName']
    //       dataForm.needCompanys = list[0]['typeName']
    //         ? list[0]['typeName'] + '-' + list[0]['firmName']
    //         : list[0]['firmName']
    //       ob['department'] = list[0]['department']
    //       ob['firmTypeId'] = list[0]['firmTypeId']
    //     } else {
    //       Message.warning({
    //         content: '请先选择需求公司',
    //         duration: 5000,
    //       })
    //     }
    //   }
    //   if (num == 3) {
    //     ob['firmName'] = ''
    //     ob['department'] = ''
    //     // ob['firmTypeId'] = ""
    //   }
    //   if (num == 4) {
    //     if (dataForm.useCompany !== '' && dataForm.useCompany !== undefined) {
    //       let list = pageData.firmListsy.filter(function (o: any) {
    //         return o['id'] == dataForm.useCompany
    //       })
    //       ob['firmName'] = list[0]['firmName']
    //       dataForm.useCompanys = list[0]['typeName']
    //         ? list[0]['typeName'] + '-' + list[0]['firmName']
    //         : list[0]['firmName']
    //       ob['department'] = list[0]['department']
    //       ob['firmTypeId'] = list[0]['firmTypeId']
    //     } else {
    //       Message.warning({
    //         content: '请先选择采购公司',
    //         duration: 5000,
    //       })
    //     }
    //   }
    //   //搜索框公司
    //   if (num == 5) {
    //     ob['firmName'] = ''
    //     ob['department'] = ''
    //   }
    //   if (num == 6) {
    //     if (pageData.dropDownDataq1 !== '' && pageData.dropDownDataq1 !== undefined) {
    //       let list = pageData.nameListq1.filter(function (o: any) {
    //         return o['id'] == pageData.dropDownDataq1
    //       })
    //       ob['firmName'] = list[0]['firmName']
    //       pageData.dropDownDataq1s = list[0]['typeName']
    //         ? list[0]['typeName'] + '-' + list[0]['firmName']
    //         : list[0]['firmName']
    //       ob['department'] = list[0]['department']
    //       ob['firmTypeId'] = list[0]['firmTypeId']
    //     } else {
    //       Message.warning({
    //         content: '请先选择需求公司',
    //         duration: 5000,
    //       })
    //     }
    //   }
    //   getFrimList(ob, num)
    // }
    const options1 = ref(pageData.firmList)
    const loading1 = ref(false)

    const handleSearch1 = (value: any) => {
      if (value) {
        loading1.value = true
        options1.value = pageData.firmList
        loading1.value = false
      } else {
        options1.value = []
      }
    }
    // function getFrimList(ob: any, nums: any) {
    //   post({
    //     url: 'org/firmGroup/getFirmInfoByMap',
    //     data: ob,
    //   }).then((result: any) => {
    //     if (result.code === 200) {
    //       if (nums == 1) {
    //         pageData.firmList = result.data
    //       }
    //       if (nums == 2) {
    //         pageData.bmList = result.data
    //       }
    //       if (nums == 3) {
    //         pageData.firmListsy = result.data
    //       }
    //       if (nums == 4) {
    //         pageData.bmListsy = result.data
    //       }
    //       if (nums == 5) {
    //         pageData.nameListq1 = result.data
    //       }
    //       if (nums == 6) {
    //         pageData.nameListq = result.data
    //       }
    //     } else {
    //       Message.error(result.message)
    //     }
    //   })
    // }
    // //公司改变 部门为=空
    // const changeGs = (num: any) => {
    //   if (num == 1) {
    //     dataForm.needDepartment = ''
    //   } else {
    //     dataForm.useDepartment = ''
    //   }
    // }
    const defaultColDef = {
      sortable: true,
      resizable: true,
      filter: true,
    }

    const isWlCodeList: any = ref([])
    const hqWlCode = () => {
      wlCode({materialCode: '', auditState: 1})
    }
    const hqWlCodes = (val: any) => {
      wlCode({materialCode: val, auditState: 1})
    }

    function wlCode(val: any) {
      post({
        url: 'purchase/MaterialInfo/getFieldValue',
        data: val,
      }).then(({data, code}: any) => {
        if (code === 200) {
          // (data as string[]).splice(0, 0, "全部");
          isWlCodeList.value = data
        } else {
          Message.error({
            content: '查询失败！',
            duration: 5000,
          })
        }
      })
    }

    const hqWlCodezs = (record: any) => {
      record.specName = ''
      record.unitName = ''
      record.materialName = ''
      post({
        url: 'purchase/MaterialInfo/getList',
        data: {
          materialCode: record.materialCode,
        },
      }).then((res: any) => {
        if (res.code == 200) {
          record.specName = res.data[0].specName
          record.unitName = res.data[0].unit
          record.materialName = res.data[0].materialName
        }
      })
    }
    const huiche = () => {
      selectHandler()
    }
    const localeText1: any = ref(localeText)
    const pagingList1: any = ref(pagingList)

    // const firmLists: any = ref([])
    // 获取公司列表
    const getFirmGroup = () => {
      post({
        url: 'org/baCompany/getTreeCompanyByUser',
        data: {},
      }).then(({code, data}) => {
        if (code === 200) {
          pageData.firmGroupList = data
          pageData.firmGroupList1 = data
          pageData.nameListq1 = data
        }
      })
    }

    let casOb = ref()
    const casOb1 = ref()
    //公司改变
    const cascaderChange = (event: any, val: any) => {
      //拿到选中的这个节点数组
      setTimeout(function () {
        if (casOb.value.selectViewValue.length != 0) {
          pageData.title = slicing(casOb.value.selectViewValue[0]['label'])
          dataForm.needCompanys = slicing(casOb.value.selectViewValue[0]['label'])
        }
      }, 100)
      getBmGroup(val)
      pageData.bmList = []
      dataForm.needDepartmentId = ''
    }
    //部门改变
    const cascaderChange1 = (val: any) => {
      //拿到选中的这个节点数组
      setTimeout(function () {
        if (casOb1.value.selectViewValue.length != 0) {
          pageData.title1 = slicing(casOb1.value.selectViewValue[0]['label'])
          dataForm.needDepartment = slicing(casOb1.value.selectViewValue[0]['label'])
          dataForm.needDepartmentId = val
        }
      }, 100)
    }
    const casOb2 = ref()
    const casOb3 = ref()
    //公司改变
    const cascaderChange2 = (event: any, val: any) => {
      //拿到选中的这个节点数组
      setTimeout(function () {
        if (casOb2.value.selectViewValue.length != 0) {
          pageData.title2 = slicing(casOb2.value.selectViewValue[0]['label'])
          dataForm.useCompanys = slicing(casOb2.value.selectViewValue[0]['label'])
        }
      }, 100)
      getBmGroup1(val)
      dataForm.useDepartmentId = ''
      pageData.bmList1 = []
    }
    //部门改变
    const cascaderChange3 = (val: any) => {
      //拿到选中的这个节点数组
      setTimeout(function () {
        if (casOb3.value.selectViewValue.length != 0) {
          pageData.title3 = slicing(casOb3.value.selectViewValue[0]['label'])
          dataForm.useDepartment = slicing(casOb3.value.selectViewValue[0]['label'])
          dataForm.useDepartmentId = val
        }
      }, 100)
      ckNum()
    }
    // 获取部门列表
    const getBmGroup1 = (val: any) => {
      post({
        url: 'org/baCompany/getDepartmentTree?companyId=' + val,
      }).then((result) => {
        if (result.code === 200) {
          pageData.bmList1 = result.data
        }
      })
    }

    // 获取部门列表
    const getBmGroup = (val: any) => {
      post({
        url: 'org/baCompany/getDepartmentTree?companyId=' + val,
      }).then((result) => {
        if (result.code === 200) {
          pageData.bmList = result.data
        }
      })
    }

    //搜索框 公司部门改变
    let casOb5 = ref()
    const casOb6 = ref()
    const cascaderChange5 = (event: any, val: any) => {
      pageData.nameListq = []
      pageData.dropDownDataq = ''
      setTimeout(function () {
        if (casOb5.value.selectViewValue.length != 0) {
          pageData.title5 = slicing(casOb5.value.selectViewValue[0]['label'])
          pageData.dropDownDataq1s = slicing(casOb5.value.selectViewValue[0]['label'])
        }
      }, 100)
      getBmGroup6(val)
      doRefresh()
    }
    const cascaderChange6 = (val: any) => {
      setTimeout(function () {
        if (casOb6.value.selectViewValue.length != 0) {
          pageData.title6 = slicing(casOb6.value.selectViewValue[0]['label'])
          pageData.dropDownDataq2 = slicing(casOb6.value.selectViewValue[0]['label'])
        }
      }, 100)
      doRefresh()
    }
    //搜索框  获取部门列表
    const getBmGroup6 = (val: any) => {
      post({
        url: 'org/baCompany/getDepartmentTree?companyId=' + val,
      }).then((result) => {
        if (result.code === 200) {
          pageData.nameListq = result.data
        }
      })
    }

    //添加物料 弹窗
    const selectedRowKeys3: any = ref([])
    let dataList: any = ref([])
    const materialCode: any = ref('')
    const materialName: any = ref('')
    const bigClassName: any = ref('')
    const middleClassName: any = ref('')
    const subClassName: any = ref('')
    const specName: any = ref('')
    const visibleWl = ref(false)
    const listPage: any = reactive({
      total: 0,
      size: 10,
      page: 1,
    })
    const PageSize3 = (val: any) => {
      listPage.page = val
      listQuery()
    }

    const change3 = (val: any) => {
      listPage.size = val
      listQuery()
    }

    const tableColumns3 = [
      {
        headerName: '',
        checkboxSelection: true,
        headerCheckboxSelection: true,
        pinned: 'left',
        width: 50
      },
      {
        headerName: '物料大类',
        field: 'bigClassName',
        width: 300,
      },
      {
        headerName: '物料中类',
        field: 'middleClassName',
        width: 300,
      },
      {
        headerName: '物料小类',
        field: 'subClassName',
        width: 300,
      },
      {
        headerName: '物料编号',
        field: 'materialCode',
        width: 300,
      },
      {
        headerName: '物料名称',
        field: 'materialName',
        width: 300,
      },
      {
        headerName: '规格',
        field: 'specName',
        width: 300,
      },
      {
        headerName: '单位',
        field: 'unit',
        width: 300,
      },
      {
        headerName: '品牌',
        field: 'brandName',
        width: 150,
      },
      {
        headerName: '图片',
        field: 'picture',
        cellRenderer: {
          template: `
            <a-image :src="'/api' + val.picture" style="margin: 0 auto; width: 100%; height: 100%;" fit="contain"/>>`,
          setup(props: any) {
            const val = ref(props.params.data)
            return {
              val,
            }
          },
        },
        width: 150,
      }
    ]
    const Query = () => {
      listPage.page = 1
      listQuery()
    }
    const listQuery = () => {
      pageData.pageLoading = true
      post({
        url: 'purchase/MaterialInfo/getPage',
        data: {
          page: listPage.page,
          size: listPage.size,
          deleteState: 0,
          materialName: materialName.value,
          materialCode: materialCode.value,
          bigClassId: objectOP.bigClassName1,
          subClassId: objectOP.bigClassName3,
          middleClassId: objectOP.bigClassName2,
          specName: specName.value,
          auditState: 1,
        },
      })
          .then(({data, code}: any) => {
            if (code === 200) {
              dataList.value = data.list
              listPage.total = data.total
              dataList.value.forEach((item: any) => {
                item['isTypeIds'] = isTypeIds++
              })
            }
          })
          .catch(console.log)
          .finally(() => {
            pageData.pageLoading = false
          })
    }
    const handleOk = () => {
      if (gridOption3.value.getSelectedRows().length === 0) {
        Message.error('请勾选数据!')
        return false
      }
      let listArray: any = []
      listArray = listArray.concat(gridOption3.value.getSelectedRows());
      // for (let i = 0; i < dataList.value.length; i++) {
      //   if (selectedRowKeys3.value.includes(dataList.value[i].isTypeIds)) {
      //     listArray.push(dataList.value[i])
      //   }
      // }
      if (isDataLists.value.length != 0) {
        let wlAarray: any = []
        for (let i = 0; i < listArray.length; i++) {
          wlAarray.push(listArray[i].materialCode)
        }
        for (let i = 0; i < isDataLists.value.length; i++) {
          if (wlAarray.includes(isDataLists.value[i].materialCode)) {
            Message.error(`不能重复添加物料名为 ${isDataLists.value[i].materialName} 的单据!`)
            return false
          }
        }
      }
      listArray.forEach((e: any) => {
        e['materialCode'] = e['materialCode']
        e['materialName'] = e['materialName']
        e['specName'] = e['specName']
        e['unitName'] = e['unit']
        e['needNum'] = 0
        e['stockNum'] = 0
        e['id'] = null
        e['isTypeIds'] = isTypeIds++
        delete e.unit
      })
      // isDataLists.value.push(...listArray)
      isDataLists.value = [
        ...isDataLists.value,
        ...listArray
      ]
      materialCode.value = ''
      materialName.value = ''
      bigClassName.value = ''
      subClassName.value = ''
      objectOP.bigClassName1 = ''
      objectOP.bigClassName2 = ''
      objectOP.bigClassName3 = ''
      specName.value = ''
      dataList.value = []
      selectedRowKeys3.value = []
      listPage.total = 0
      visibleWl.value = false
      ckNum()
      return true
    }
    const handleCancel = () => {
      objectOP.bigClassName1 = ''
      objectOP.bigClassName2 = ''
      objectOP.bigClassName3 = ''
      materialCode.value = ''
      materialName.value = ''
      bigClassName.value = ''
      subClassName.value = ''
      specName.value = ''
      dataList.value = []
      selectedRowKeys3.value = []
      listPage.total = 0
      visibleWl.value = false
    }

    //库存数量  修改
    const ckNum = () => {
      post({
        url: '/wms/WjController/getMarInfo',
        data: isDataLists.value.map((item: any) => {
          return {
            materialCode: item.materialCode,
            companyId: dataForm.useCompany,
            materialName: item.materialName,
          }
        }),
      }).then((res: any) => {
        const {data} = res
        isDataLists.value.map((item: any, index: any) => {
          if (item && data && index >= 0 && index < data.length) {
            if (item.materialCode === data[index].materialCode) {
              item.stockNum = data[index].stockNum;
            } else {
              item.stockNum = 0;
            }
          } else {
            item.stockNum = 0;
          }
        })
      })
    }
    //库存数量  详情
    const ckNum1 = (record: any) => {
      post({
        url: '/wms/WjController/getMarInfo',
        data: isDataLists.value.map((item: any) => {
          return {
            materialCode: item.materialCode,
            companyId: record.useCompany,
            materialName: item.materialName,
          }
        }),
      }).then((res: any) => {
        const {data} = res
        isDataLists.value.map((item: any, index: any) => {
          if (item && data && index >= 0 && index < data.length) {
            if (item.materialCode === data[index].materialCode) {
              item.stockNum = data[index].stockNum;
            } else {
              item.stockNum = 0;
            }
          } else {
            item.stockNum = 0;
          }
        })
      })
    }
    //下拉框   物料大类  
    // const WLfocusSel = () => {
    //   WLselCxAll({ bigClassName: '', auditState: 1 })
    // }
    //下拉框   物料大类  大1 中2 小3
    const WLfocusSel = (val: any, eventVal: any = null) => {
      if (!eventVal) eventVal = ''
      if (val === 1) {
        post({
          url: 'purchase/MaterialBigClass/getFieldValue',
          data: {"bigClassName": eventVal},
        }).then(({data, code}: any) => {
          if (code === 200) {
            objectOP.bigName1 = data
          } else {
            Message.error({
              content: '查询失败！',
              duration: 5000,
            })
          }
        })
      } else if (val === 2) {
        post({
          url: 'purchase/MaterialMiddleClass/getFieldValue',
          // data: { bigClassId: objectOP.bigClassName1 },
          data: {"middleClassName": eventVal, filterMap: {"bigClassId": objectOP.bigClassName1}}
        }).then(({data, code}: any) => {
          if (code === 200) {
            objectOP.bigName2 = data
          } else {
            Message.error({
              content: '查询失败！',
              duration: 5000,
            })
          }
        })
      } else if (val === 3) {
        post({
          url: 'purchase/MaterialSubClass/getFieldValueFilter',
          // data: { middleClassId: objectOP.bigClassName2 },
          data: {"subClassName": eventVal, filterMap: {"middleClassId": objectOP.bigClassName2}}
        }).then(({data, code}: any) => {
          if (code === 200) {
            objectOP.bigName3 = data
          } else {
            Message.error({
              content: '查询失败！',
              duration: 5000,
            })
          }
        })
      }
    }
    const WLoptions = ref<any>(pageData.bigName)
    const WLloading = ref(false)
    const WLhandleSearch = (value: any) => {
      if (value) {
        const ob = {bigClassName: value, auditState: 1}
        WLloading.value = true
        window.setTimeout(() => {
          selCxAll(ob)
          WLoptions.value = pageData.bigName
          WLloading.value = false
        }, 200)
      } else {
        WLoptions.value = []
      }
    }

    function WLselCxAll(val: any) {
      post({
        url: 'purchase/MaterialInfo/getFieldValue',
        data: val,
      }).then(({data, code}: any) => {
        if (code === 200) {
          let list = []
          for (let i = 0; i < data.length; i++) {
            var ob = data[i].bigClassName
            list.push(ob)
          }
          const arr = list
          const setData = Array.from(new Set(arr));
          pageData.bigName = setData
        } else {
          Message.error({
            content: '查询失败！',
            duration: 5000,
          })
        }
      })
    }

    const bigChange = (val: any) => {
      if (val === 1) {
        objectOP.bigName2 = []
        objectOP.bigClassName2 = ''
        objectOP.bigName3 = []
        objectOP.bigClassName3 = ''
      } else if (val === 2) {
        objectOP.bigName3 = []
        objectOP.bigClassName3 = ''
      }
    }
    //下拉框   物料小类  
    const WLfocusSel1 = () => {
      WLselCxAll1({bigClassName: dataForm.bigClassName, subClassName: '', auditState: 1})
    }
    const WLoptions1 = ref<any>(pageData.samllName)
    const WLloading1 = ref(false)
    const WLhandleSearch1 = (value: any) => {
      if (value) {
        const ob = {bigClassName: dataForm.bigClassName, subClassName: value, auditState: 1}
        WLloading.value = true
        window.setTimeout(() => {
          WLselCxAll1(ob)
          WLoptions.value = pageData.samllName
          WLloading.value = false
        }, 200)
      } else {
        WLoptions.value = []
      }
    }

    function WLselCxAll1(val: any) {
      if (bigClassName.value === '') {
        Message.warning('请先选择物料大类！')
        pageData.samllName = []
      }
      post({
        url: 'purchase/MaterialInfo/getList',
        data: val
      }).then(({data, code}: any) => {
        if (code === 200) {
          let list = []
          for (let i = 0; i < data.length; i++) {
            var ob = data[i].subClassName
            list.push(ob)
          }
          const arr = list
          const setData = Array.from(new Set(arr));
          pageData.samllName = setData
        } else {
          Message.error({
            content: '查询失败！',
            duration: 5000,
          })
        }
      })
    }

    // 下拉框  物料编码 
    const WLfocusSel2 = () => {
      WLselCxAll2({materialCode: '', auditState: 1})
    }
    const WLoptions2 = ref<any>(pageData.codeList)
    const WLloading2 = ref(false)
    const WLhandleSearch2 = (value: any) => {
      if (value) {
        const ob = {materialCode: value, auditState: 1}
        WLloading2.value = true;
        WLselCxAll2(ob);
        WLoptions2.value = pageData.codeList;
        WLloading2.value = false;
      } else {
        WLoptions2.value = []
      }
    }

    function WLselCxAll2(val: any) {
      post({
        url: 'purchase/MaterialInfo/getFieldValue',
        data: val,
      }).then(({data, code}: any) => {
        if (code === 200) {
          pageData.codeList = data
        } else {
          Message.error({
            content: '查询失败！',
            duration: 5000,
          })
        }
      })
    }

    const WLhandleCode = (e: any) => {
      materialCode.value = e.split('——')[0]
    }

    // 下拉框  物料名称
    const WLfocusSel3 = () => {
      WLselCxAll3({materialName: '', auditState: 1})
    }
    const WLoptions3 = ref<any>(pageData.wlNameList)
    const WLloading3 = ref(false)
    const WLhandleSearch3 = (value: any) => {
      if (value) {
        const ob = {materialName: value, auditState: 1}
        WLloading3.value = true;
        WLselCxAll3(ob);
        WLoptions3.value = pageData.wlNameList;
        WLloading3.value = false;
      } else {
        WLoptions3.value = []
      }
    }

    function WLselCxAll3(val: any) {
      post({
        url: 'purchase/MaterialInfo/getFieldValue',
        data: val,
      }).then(({data, code}: any) => {
        if (code === 200) {
          pageData.wlNameList = data
        } else {
          Message.error({
            content: '查询失败！',
            duration: 5000,
          })
        }
      })
    }

    const WLhandleName = (e: any) => {
      materialName.value = e.split('——')[1]
    }

    // 下拉框  规格
    const WLfocusSel4 = () => {
      WLselCxAll4({specName: '', auditState: 1})
    }
    const WLoptions4 = ref<any>(pageData.specList)
    const WLloading4 = ref(false)
    const WLhandleSearch4 = (value: any) => {
      if (value) {
        const ob = {specName: value, auditState: 1}
        WLloading4.value = true;
        WLselCxAll4(ob);
        WLoptions4.value = pageData.specList;
        WLloading4.value = false;
      } else {
        WLoptions4.value = []
      }
    }

    function WLselCxAll4(val: any) {
      post({
        url: 'purchase/MaterialInfo/getFieldValue',
        data: val,
      }).then(({data, code}: any) => {
        if (code === 200) {
          pageData.specList = data
        } else {
          Message.error({
            content: '查询失败！',
            duration: 5000,
          })
        }
      })
    }

    const districtList: any = ref([])
    const focusSel2 = () => {
      post({
        url: "planSingle/machineArea/getMachineAreaPara",
        data: {firmId: dataForm.useCompany, deleteState: 0}
      }).then(({data, code}: any) => {
        if (code === 200) {
          districtList.value = data;
        } else {
          Message.error({
            content: "查询失败！",
            duration: 5000,
          });
        }
      });
    }

    const locationList: any = ref([])
    const focusSel1 = () => {
      post({
        url: "planSingle/LocationMarkSet/select",
        data: {deleteState: 0}
      }).then(({data, code}: any) => {
        if (code === 200) {
          locationList.value = data;
        } else {
          Message.error({
            content: "查询失败！",
            duration: 5000,
          });
        }
      });
    }
    const EnterPress = (e: any) => {
      const inputs = document.getElementsByName('input'); // inputs 里存放了所有name为input的html元素
      inputs.forEach((input, index) => {
        if (e.currentTarget === input) {
          // 通过循环判断来获取当前输入框的index下标，进行相关操作
          if (index !== (inputs.length - 1)) {
            inputs[index + 1].focus();
          }
        }
      })
    }

    const {
      saveGridState: saveGridState02,
      updateGridState: updateGridState02
    } = saveOrUpdateGridState02('Requirement0-2', gridOption2, colState2, tableColumns1)
    const onColumnMoved2 = () => {
      saveGridState02()
    }
    const onColumnResized2 = () => {
      saveGridState02()
    }
    const onColumnVisible2 = () => {
      saveGridState02()
    }
    const {
      saveGridState: saveGridState03,
      updateGridState: updateGridState03
    } = saveOrUpdateGridState03('Requirement0-3', gridOption3, colState3, tableColumns3)
    const onColumnMoved3 = () => {
      saveGridState03()
    }
    const onColumnResized3 = () => {
      saveGridState03()
    }
    const onColumnVisible3 = () => {
      saveGridState03()
    }
    const {
      saveGridState: saveGridState04,
      updateGridState: updateGridState04
    } = saveOrUpdateGridState04('Requirement0-4', gridOption4, colState4, tableColumnsXqs)
    const onColumnMoved4 = () => {
      saveGridState04()
    }
    const onColumnResized4 = () => {
      saveGridState04()
    }
    const onColumnVisible4 = () => {
      saveGridState04()
    }
    return {
      EnterPress,
      tableColumnsXqs,
      focusSel1,
      focusSel2,
      colState,
      saveOrUpdateGridState02,
      saveGridState02,
      updateGridState02,
      onColumnMoved2,
      onColumnResized2,
      onColumnVisible2,
      colState2,
      gridReady2,
      gridOption2,
      saveOrUpdateGridState03,
      saveGridState03,
      updateGridState03,
      onColumnMoved3,
      onColumnResized3,
      onColumnVisible3,
      colState3,
      gridReady3,
      gridOption3,
      saveOrUpdateGridState04,
      saveGridState04,
      updateGridState04,
      onColumnMoved4,
      onColumnResized4,
      onColumnVisible4,
      colState4,
      gridReady4,
      gridOption4,
      middleClassName,
      specName,
      bigChange,
      WLhandleCode,
      WLhandleName,
      WLoptions,
      WLoptions1,
      WLoptions2,
      WLoptions3,
      WLoptions4,
      WLloading,
      WLloading1,
      WLloading2,
      WLloading3,
      WLloading4,
      WLfocusSel,
      WLfocusSel1,
      WLfocusSel2,
      WLfocusSel3,
      WLfocusSel4,
      WLhandleSearch,
      WLhandleSearch1,
      WLhandleSearch2,
      WLhandleSearch3,
      WLhandleSearch4,
      WLselCxAll,
      WLselCxAll1,
      WLselCxAll2,
      WLselCxAll3,
      WLselCxAll4,
      ckNum1,
      ckNum,
      listPage,
      Query,
      listQuery,
      dataList,
      selectedRowKeys3,
      tableColumns3,
      change3,
      PageSize3,
      handleOk,
      handleCancel,
      visibleWl,
      materialCode,
      materialName,
      bigClassName,
      subClassName,
      permissionStore,
      casOb,
      casOb1,
      casOb2,
      casOb3,
      casOb5,
      casOb6,
      pagingList1,
      getBmGroup1,
      getBmGroup6,
      cascaderChange6,
      cascaderChange5,
      cascaderChange3,
      cascaderChange2,
      cascaderChange,
      cascaderChange1,
      getFirmGroup,
      huiche,
      localeText1,
      hqWlCodezs,
      hqWlCodes,
      isWlCodeList,
      hqWlCode,
      defaultColDef,
      gridOption,
      gridReady,
      total,
      options1,
      loading1,
      handleSearch1,
      // foucusUseFrim,
      // changeGs,
      focusSelq1,
      handleSearchq1,
      optionsq1,
      loadingq1,
      rejecteds,
      auditSh,
      handles,
      scroll,
      scrollbar,
      headerShow,
      auditStates,
      // auditSh,
      handleSearchqs,
      focusSelqs,
      loadingqs,
      loadingq,
      focusSelq,
      handleSearchq,
      scWl,
      cancelsDel,
      focusSelz,
      handleSearchz,
      selectedRowKeys1,
      isDataLists,
      sideOks,
      handleSearchs,
      focusSels,
      isDataList,
      tjWl,
      tableColumns1,
      deleteHandler,
      sideOk,
      formRef,
      dataForm,
      addHandler,
      selectedRowKeys,
      pagination,
      tableColumns,
      table,
      rowKey,
      pageData,
      queryData,
      editHandler,
      selectHandler,
      inputBlur,
      isChiese,
      exports,
      options,
      loading,
      handleSearch,
      focusSel,
      downloadHandler,
      importHandler,
      pageData1,
      cxDetails,
      visible,
      PageSize,
      change1,
      objectOP,
      onSelect(dateString: any, date: any) {
        pageData.dropDownDataqszs = {
          startDate: dateString[0],
          endDate: dateString[1],
        }
      },
      onClear() {
        pageData.dropDownDataqszs = {}
      },
      table1Ref,
      configTable1,
    }
  },
  components: {Toolbar, },
}
</script>
<style scoped lang="less">
:deep(.arco-table-td-content) {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

:deep(.arco-picker input) {
  padding-left: 0 !important;
}

:deep(.arco-picker) {
  padding-left: 0 !important;
}

:deep(.arco-picker-separator) {
  padding: 0 !important;
}

:deep(.ag-cell-wrapper) {
  height: 100% !important;
}

:deep(.ag-cell-value) {
  height: 100% !important;
}

:deep(.arco-image-img ) {
  height: 100%;
}
</style>